<template>
  <div class="executing-page">

    <div style="display: flex; justify-content: center; align-items: center">
      <img src="../../../../assets/image/executing-red.png" alt="" style="width: 150px; margin-top: 20px">
      <el-row type="flex" id="release-btn" style="width: 55%; justify-content: right">
        <el-button type="goon" icon="el-icon-plus" @click="dialogVisible = true" style="height: 40px">发布任务</el-button>
      </el-row>
    </div>

    <div class="list-box">
      <task-info-list
          :loading="loading"
          :data="taskList"
          :data-items="['taskname', 'type', 'deviceRequirement', 'deadline', 'reportPrice']">
        <template slot="option" scope="{task}">
          <el-button type="goon" @click="gotoDetail(task)">任务详情</el-button>
        </template>
      </task-info-list>
    </div>
    <el-dialog
        title="请选择需要发布的任务类型"
        :visible.sync="dialogVisible"
        width="50%">
      <span>
        <el-button @click="pushToSingleRelease">单用户任务</el-button>
        <el-button @click="pushToMultipleRelease">多用户协作任务</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import {getExecutingTasksByBossID} from "@/api/boss";
import TaskInfoList from "@/components/new/info-list/TaskInfoList";
import {transformTaskType} from "@/utils/TaskType";

export default {
  name: "Executing",
  components: {TaskInfoList},
  created() {
    this.getTaskList();

  },

  data() {
    return {
      taskList: [],
      loading: true,
      dialogVisible: false,
    }
  },

  methods: {
    async getTaskList(bossid) {
      const res = await getExecutingTasksByBossID(sessionStorage.getItem('userid'));
      if (res.code === 500) {
        this.loading = false;
        return this.$message.error(res.msg);
      }
      if (res.code === 404) {
        this.loading = false;
        return this.$message.info('未找到正在执行的任务');
      }

      this.taskList = transformTaskType(res.data);
      this.loading = false;
    },

    gotoDetail(task) {
      if(task.type === '协作测试'){
        this.$router.push(`/boss/mytasks/collaborationTaskDetail/${task.id}`);
      }else{
        this.$router.push(`/boss/mytasks/detail/${task.id}?isHistory=false`);
      }

    },

    // gotoRelease() {
    //   this.$router.push('/boss/release');
    // },

    pushToSingleRelease(){
      this.dialogVisible = false;
      this.$router.push('/boss/release');
    },
    pushToMultipleRelease(){
      this.dialogVisible = false;
      this.$router.push('/boss/multiUserRelease');
    }
  }

}
</script>

<style scoped>

#release-btn {
  margin-top: 20px;
}

.list-box {
  border: 1px solid #DCDFE6;
  box-shadow: 0 0 8px #909399;

  margin: 8px auto;
  width: 60%;
  padding: 3% 3%;

  background-color: #ffffff;
}


</style>
